<template>
  <div class="about">
    <div class="back">
      <el-carousel height="100vh">
        <el-carousel-item v-for="item in carouseData" :key="item">
          <img style="width: 100%;" :src="item.url" alt="" />
        </el-carousel-item>
      </el-carousel>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      carouseData:[
        {url: require("../assets/imgs/p2.png")},
        {url: require("../assets/imgs/product.png")},
        {url: require("../assets/imgs/p3.png")},
        {url: require("../assets/imgs/p4.png")},
      ]
    };
  },
  methods: {
    handleSelect(key, keyPath) {
      console.log(key, keyPath);
    }
  }
}
</script>
<style>
.back{
  z-index: 1;
}
.el-carousel__item h3 {
  color: #475669;
  font-size: 18px;
  opacity: 0.75;
  line-height: 300px;
  margin: 0;
}
body{
  margin: 0;
}
</style>